<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <link th:href="@{/erp/assets/css/bootstrap.min.css}" rel="stylesheet"/>
        <link rel="stylesheet" th:href="@{/plugins/layui/css/layui.css}" media="all">
        <script th:src="@{/plugins/layui/layui.js}"></script>
        <title>Title</title>
        <style>
            .layui-form {
                margin-top: 50px;
                margin-right: 200px;
                margin-left: 50px;
            }

            .layui-form-label {
                width: 100px;
            }
        </style>
    </head>
    <body>
        <form class="layui-form">
            <input type="hidden" name="cuId" th:value="${param.companyId}">
            <div class="layui-form-item">
                <label class="layui-form-label">产品名称：</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" disabled th:value="${param.pname}"/>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">产品编号：</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" disabled name="proId"
                           th:value="${param.id}"/>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">需求数量：</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" id="sum" name="sum" />
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">申请人：</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" id="orderPerson" name="orderPerson" />
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">会员名：</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" id="orderName" name="orderName"/>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">收货人：</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" id="consignee" name="consignee"/>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">支付方式：</label>
                <div class="layui-input-block">
                    <select id="payType" name="payType" >
                        <option value="">请选择交易类型</option>
                        <option value="线上">线上</option>
                        <option value="线下">线下</option>
                    </select>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">备注：</label>
                <div class="layui-input-block">
                    <input type="text" class="layui-input" name="orderMark" />
                </div>
            </div>

            <div class="layui-form-item" style="margin-top: 50px">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>

            </ul>
        </form>
    </body>
</html>
<script>
    layui.use('form', function () {

        var form = layui.form;
        var $ = layui.jquery;

        var reg = /^\+?[1-9]\d*$/;
        var name = /^[\u4e00-\u9fa5]{2,4}$/;

        $("#sum").blur(function () {
            if ($("#sum").val().length == 0) {
                layer.tips('需求数量不能为空!', '#sum', {
                    tips: [2, 'red'],
                    time: 1000
                });
                return
            } else if (!reg.test($("#sum").val())) {
                layer.tips('需求数量只能为正整数!', '#sum', {
                    tips: [2, 'red'],
                    time: 1000
                });
                return
            }
        })
        $("#orderPerson").blur(function () {
            if ($("#orderPerson").val().length == 0) {
                layer.tips('申请人不能为空!', '#orderPerson', {
                    tips: [2, 'red'],
                    time: 1000
                });
                return
            } else if (!name.test($("#orderPerson").val())) {
                layer.tips('申请人请输入人名!', '#orderPerson', {
                    tips: [2, 'red'],
                    time: 1000
                });
                return
            }
        })
        $("#orderName").blur(function () {
            if ($("#orderName").val().length == 0) {
                layer.tips('会员名不能为空!', '#orderName', {
                    tips: [2, 'red'],
                    time: 1000
                });
                return
            } else if (!name.test($("#orderName").val())) {
                layer.tips('会员名请输入人名!', '#orderName', {
                    tips: [2, 'red'],
                    time: 1000
                });
                return
            }
        })
        $("#consignee").blur(function () {
            if ($("#consignee").val().length == 0) {
                layer.tips('收货人不能为空!', '#consignee', {
                    tips: [2, 'red'],
                    time: 1000
                });
                return
            } else if (!name.test($("#consignee").val())) {
                layer.tips('收货人请输入人名!', '#consignee', {
                    tips: [2, 'red'],
                    time: 1000
                });
                return
            }
        })
        //监听提交
        form.on('submit(formDemo)', function (data) {
            var reg = /^\+?[1-9]\d*$/;
            var name = /^[\u4e00-\u9fa5]{2,4}$/;
            ;
            if ($("#sum").val().length == 0) {
                layer.tips('需求数量不能为空!', '#sum', {
                    tips: [2, 'red'],
                    time: 1000
                });
                return false;
            } else if (!reg.test($("#sum").val())) {
                layer.tips('需求数量只能为正整数!', '#sum', {
                    tips: [2, 'red'],
                    time: 1000
                });
                return false;
            } else if ($("#orderPerson").val().length == 0) {
                layer.tips('申请人不能为空!', '#orderPerson', {
                    tips: [2, 'red'],
                    time: 1000
                });
                return false;
            } else if (!name.test($("#orderPerson").val())) {
                layer.tips('申请人请输入人名!', '#orderPerson', {
                    tips: [2, 'red'],
                    time: 1000
                });
                return false;
            } else if ($("#orderName").val().length == 0) {
                layer.tips('会员名不能为空!', '#orderName', {
                    tips: [2, 'red'],
                    time: 1000
                });
                return false;
            } else if (!name.test($("#orderName").val())) {
                layer.tips('会员名请输入人名!', '#orderName', {
                    tips: [2, 'red'],
                    time: 1000
                });
                return false;
            } else if ($("#consignee").val().length == 0) {
                layer.tips('收货人不能为空!', '#consignee', {
                    tips: [2, 'red'],
                    time: 1000
                });
                return false;
            } else if (!name.test($("#consignee").val())) {
                layer.tips('收货人请输入人名!', '#consignee', {
                    tips: [2, 'red'],
                    time: 1000
                });
                return false;
            }else if ($("#payType").val() == null || $("#payType").val() == ""){
                layer.msg('请选择支付方式!');
                return false;
            }
            $.ajax({
                url: '/supplier/apply',
                data: data.field,
                contentType: 'application/json',           //表示我们发送给服务器数据是json格式
                dataType: 'json',                          //表示服务器返回给我们的数据是json格式
                success: function (data) {
                    if (data.result == true) {
                        // 提交成功后的回调
                        layer.msg('添加成功，请到采购列表查看！', {icon: 1, time: 1000}, function () {
                            var index = parent.layer.getFrameIndex(window.name);
                            parent.layer.close(index);
                            parent.layui.table.reload("demo");
                        });
                    } else {
                        layer.msg('添加失败！', {icon: 2,});
                    }
                },
                error: function (data) {
                    layer.alert("添加失败：" + data.data);
                }
            })
            return false;
        });
        form.render();
    });
</script>